<script setup lang="ts">
import {reactive} from "vue"
import {useUserStore} from '@/store/modules/user'

let loginParam = reactive({username: '', password: ''})

const userStore = useUserStore();
const loginByUsername = async () => {
  try {
    await userStore.login(loginParam)
    alert('登录成功')
  } catch (e) {
    console.log(e)
  }
}

</script>

<template>
  <div>

    <SvgIcon name="username" width="30px" height="30px"/>
    <el-input v-model="loginParam.username" style="width: 240px" placeholder="请输入用户名"/>
    <br>
    <el-input
        v-model="loginParam.password"
        style="width: 240px"
        type="password"
        placeholder="请输入密码"
        show-password/>
    <br>
    <div class="mb-4" @click="loginByUsername">
      <el-button type="primary" plain>登录</el-button>
    </div>
  </div>
</template>

<style scoped>

</style>